<!DOCTYPE html>
<html>
<head>
    <title>详情展示</title>
    {% include 'admin/common/header.html' %}
    <link rel="stylesheet" href="{{ url_for('static', filename='/admin/admin/css/other/console1.css') }}"/>
</head>
<body>
<form class="layui-form" action="">
        <div class="main-container">

            <div id="score_1" style="background-color:#ffffff;min-height:500px;padding: 10px"></div>
         </div>
</form>
{# 用户表格 #}
<div class="user-main user-collasped">
    <div class="layui-card">
        <div class="layui-card-body">
            <table id="user-table" lay-filter="user-table"></table>
        </div>
    </div>
</div>
</body>
{# 用户修改操作 #}
<script type="text/html" id="user-bar">
    <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit"><i class="pear-icon pear-icon-file"></i>
    </button>
</script>


{# 训练时间 #}
<script type="text/html" id="train-time">
    {{ '  {{layui.util.toDateString(d.train_time,  "yyyy-MM-dd HH:mm:ss")}' |safe }}}
</script>

{% include 'admin/common/footer.html' %}


<script type="text/html" id="police-updateTime">
    {{ '  {{layui.util.toDateString(d.update_at,  "yyyy-MM-dd HH:mm:ss")}' |safe }}}
</script>

<script>
layui.use(['layer', 'echarts', 'element', 'count'], function () {
var chartDom = document.getElementById('score_1');
var myChart = echarts.init(chartDom);
var option;
data = []
        {% for action in data %}
            {%if loop.revindex <= 20%}
              data.push("{{ action.grade }}")
            {%endif%}
        {% endfor %}

option = {
  title: {
    text: '最近二十次训练成绩走势'
  },
  tooltip: {
    trigger: 'axis'
  },
  legend: {
    data: ['动作标准训练成绩']
  },
  grid: {
    left: '3%',
    right: '4%',
    bottom: '3%',
    containLabel: true
  },
  toolbox: {
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    type: 'category',
    boundaryGap: false,
    data: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20]
  },
  yAxis: {
    type: 'category',
    data:['中','良','优']
  },
  series: [
    {
      name: '动作标准训练成绩',
      type: 'line',
      stack: 'Total',
      data:data
    }
  ]
};

option && myChart.setOption(option);
})
</script>
<script>
layui.use(['layer', 'echarts', 'element', 'count'], function () {
let table = layui.table
let form = layui.form
let $ = layui.jquery
let dtree = layui.dtree
let popup = layui.popup
let common = layui.common
let MODULE_PATH = '/course/standard/result/detail/'

data = []
        {% for action in data %}
            data.push({
                course_id: parseInt({{ action.course_id }}),
                course_name:"{{ action.course_name }}",
                action_id: {{action.action_id}},
                action_name: "{{ action.action_name }}",
                train_time: "{{ action.train_time }}",
                grade_id: {{ action.grade_id }},
                grade: "{{ action.grade }}",
            })
        {% endfor %}
// 表格数据
let cols = [
    [
        {title: '课程名称', field: 'course_name', align: 'center'},
        {title: '动作名称', field: 'action_name', align: 'center'},
        {title: '训练评价', field: 'grade', align: 'center'},
        {title: '训练时间', field: 'train_time', templet: '#train-time', align: 'center'},
        {title: '详情', toolbar: '#user-bar', align: 'center', width: 130}
    ]
]

// 渲染表格数据
table.render({
    elem: '#user-table',
    page: true,
    cols: cols,
    skin: 'line',
    height: 'full-148',
    toolbar: '#user-toolbar', /*工具栏*/
    text: {none: '暂无成绩信息'},
    data:data,
    defaultToolbar: [{layEvent: 'refresh', icon: 'layui-icon-refresh'}, 'filter', 'print', 'exports'] /*默认工具栏*/
})



$('.user-group').click(function () {
    let group = $(this).attr('user-group')
    let field = form.val('user-query-form')
    if (group === '-1') {
        field.deptId = group
        $(this).removeClass('button-default')
        $(this).prev().removeClass('button-primary')
        $(this).prev().addClass('button-default')
        $(this).addClass('button-primary')
    } else {
        field.deptId = group
        $(this).removeClass('button-default')
        $(this).next().removeClass('button-primary')
        $(this).next().addClass('button-default')
        $(this).addClass('button-primary')
    }
    window.refresh(field)
})

table.on('tool(user-table)', function (obj) {
    if (obj.event === 'remove') {
        window.remove(obj)
    } else if (obj.event === 'edit') {
        window.edit(obj)
    }
})

table.on('toolbar(user-table)', function (obj) {
    if (obj.event === 'refresh') {
        window.refresh()
    } else if (obj.event === 'batchRemove') {
        window.batchRemove(obj)
    } else if (obj.event === 'collasped') {
        $('.user-left').toggleClass('user-collasped')
        $('.user-main').toggleClass('user-collasped')
        table.resize()
    }
})

form.on('submit(user-query)', function (data) {
    window.refresh(data.field)
    return false
})


window.edit = function (obj) {
    layer.open({
        type: 2,
        title: '训练详细信息',
        shade: 0.1,
        area: ['100%', '100%'],
        content: MODULE_PATH + 'detail/' + obj.data.grade_id
    })
}

window.remove = function (obj) {
    layer.confirm('确定要删除该成绩', {icon: 3, title: '提示'}, function (index) {
        layer.close(index)
        let loading = layer.load()
        $.ajax({
            url: MODULE_PATH + 'remove/' + obj.data['action_id'],
            dataType: 'json',
            type: 'delete',
            success: function (result) {
                layer.close(loading)
                if (result.success) {
                    popup.success(result.msg, function () {
                        obj.del()
                    })
                } else {
                    popup.failure(result.msg)
                }
            }
        })
    })
}

window.batchRemove = function (obj) {
    let data = table.checkStatus(obj.config.id).data
    if (data.length === 0) {
        layer.msg('未选中数据', {
            icon: 3,
            time: 1000
        })
        return false
    }
    var ids = []
    var hasCheck = table.checkStatus('user-table')
    var hasCheckData = hasCheck.data
    if (hasCheckData.length > 0) {
        $.each(hasCheckData, function (index, element) {
            ids.push(element.action_id)
        })
    }
    {#console.log(ids);#}
    layer.confirm('确定要删除选中成绩', {
        icon: 3,
        title: '提示'
    }, function (index) {
        layer.close(index)
        let loading = layer.load()
        $.ajax({
            url: MODULE_PATH + 'batchRemove',
            data: {ids: ids},
            dataType: 'json',
            type: 'delete',
            success: function (result) {
                layer.close(loading)
                if (result.success) {
                    popup.success(result.msg, function () {
                        table.reload('user-table')
                    })
                } else {
                    popup.failure(result.msg)
                }
            }
        })
    })
}

window.refresh = function (param) {
    table.reload('user-table', {where: param})
}
})
</script>

</html>